@charset utf-8;

* { font-family:'맑은 고딕',Malgun Gothic, '돋움', Dotum, sans-serif !important; }
[class^="icon-"], [class*=" icon-"] { vertical-align:middle !important; }
ul { margin:0; list-style:none; }

#wrap { position:relative; width:100%; margin:0; padding:0; overflow:hidden; }
.contents { position:relative; padding:30px; }
.footer { margin-top:50px; padding:10px 0; border-top:1px solid #e1e1e1; }
caption { position:absolute; top:-1000em; left:-1000em; }

/* Customize the navbar links to be fill the entire space of the .navbar */
  .navbar .navbar-inner {
    padding: 0;
  }
  .navbar .nav {
    margin: 0;
    display: table;
    width: 100%;
  }
  .navbar .nav li {
    display: table-cell;
    width: 1%;
    float: none;
  }
  .navbar .nav li a {
    font-weight: bold;
    text-align: center;
    border-left: 1px solid rgba(255,255,255,.75);
    border-right: 1px solid rgba(0,0,0,.1);
  }
  .navbar .nav li:first-child a {
    border-left: 0;
    border-radius: 3px 0 0 3px;
  }
  .navbar .nav li:last-child a {
    border-right: 0;
    border-radius: 0 3px 3px 0;
  }

/* Main marketing message and sign up button */
  .jumbotron {
    margin: 80px 0;
    text-align: center;
  }
  .jumbotron h1 {
    font-size: 100px;
    line-height: 1;
  }
  .jumbotron .lead {
    font-size: 24px;
    line-height: 1.25;
  }
  .jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
  }

h3 { letter-spacing:-1px; color:#666; }
h3.score_title { float:right; margin:0; color:#666; font-size:18px; }
h3.score_title .num { color:#2f96b4; font-size:25px; letter-spacing:-2px; }

.update .subject { color:#333; }
.update .time { font-size:9px; color:#666; }
.update .content { display:inline-block; padding-left:15px; font-size:12px; }


.table { position:relative; width:100%; font-size:12px; table-layout:fixed; }
.table tbody tr:hover { outline:3px solid #f60; }
.table td { text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.table td.score { text-align:right; }
.table td.time { color:#999; }
.table th { text-align:center; }
.table th:nth-child(1) { width:7%; }
.table th:nth-child(2) { width:23%; }
.table th:nth-child(3) { width:45%; }
.table th:nth-child(4) { width:10%; }
.table th:nth-child(5) { width:15%; }

.table td:nth-child(1) { text-align:center; }

.table.updatelog tbody tr:hover { outline:none; }
.table.updatelog td { color:#999; }
.table.updatelog tr:nth-child(1) td { font-weight:bold; color:#333; }
.table.updatelog td .warning { color:#b94a48; }


.table.admin-url th:nth-child(1) { width:15%; }
.table.admin-url th:nth-child(2) { width:46%; }
.table.admin-url th:nth-child(3) { width:7%; }
.table.admin-url th:nth-child(4) { width:7%; }
.table.admin-url td { text-align:center; }
.table.admin-url td input { width:90%; margin:0; }


.install-link { float:left; }

.install li { margin-top:40px; font-weight:bold; }
.install li img { margin-top:5px; border:1px solid #e1e1e1; }

.search_wrap { width:100%; text-align:center; }
.search_wrap .keywordWrap { margin-top:10px; }
.search_wrap .keywordWrap label { position:absolute; top:-1000em; left:-1000em; }
.search_wrap .ucWrap { display:inline-block; vertical-align:middle; }
.search_wrap .ucWrap * { vertical-align:middle; margin:0; padding:0; }
.search_wrap .ucWrap input { margin-right:5px; }


.nav { margin-bottom:0; }
.nav li.active a { background:url('/tools/a11y/img/bg_chart_tab.png') repeat; }
.tab-pane { padding:10px; background:url('/tools/a11y/img/bg_chart_tab.png') repeat; border-radius:0 0 4px 4px; border-bottom:1px solid #ddd; border-left:1px solid #ddd; border-right:1px solid #ddd; overflow:hidden; }

.stat-container {
	display: table;
	margin-bottom: 1.5em;
	width: 100%;
}

.stat-holder {
	display: table-cell;
	width: 25%;
}

.stat span {
	display: block;
	margin-bottom: .4em;
	font-size: 32px;
	font-weight: 600;
	font-style: normal;
	color: #4A515B;
}

.stat {
	height: 50px;
	padding: 15px;
	margin-right: 1em;
	
	font-size: 12px;
	font-style: italic;
	text-align: center;
	color: #888;
	
	background: #FFF;
	
	border: 1px solid #CCC;
	
	border-radius: 5px;
	
	text-shadow: 1px 1px 2px rgba(255,255,255,.5);
}

.stat-container .stat-holder:last-child .stat {	margin: 0; }

.chart_header { 
	position: relative;
	
	height: 40px;
	line-height: 40px;
	
	background: #E9E9E9;
	background:-moz-linear-gradient(top, #FAFAFA 0%, #E9E9E9 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#FAFAFA), color-stop(100%,#E9E9E9)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%); /* Opera11.10+ */
	background:-ms-linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%); /* IE10+ */
	background:linear-gradient(top, #FAFAFA 0%,#E9E9E9 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9')";
	
	border: 1px solid #D5D5D5;
	
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright: 4px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	
	-webkit-background-clip: padding-box;
 }
.chart_header i { margin-left:10px; }
.chart_header h3 { 
 	position: relative;
	top: 2px;
	left: 10px;
	
	display: inline-block;
	margin-right: 3em;
	
	font-size: 14px;
	font-weight: 800;
	color: #555;
	line-height: 18px;
	
	text-shadow: 1px 1px 2px rgba(255,255,255,.5);
  }
.chart { position:relative; padding:20px 20px 10px 20px; border:1px solid #d5d5d5; border-top:0; border-radius:0 0 4px 4px; background:#fff; }
.chart .wrap { width:100%; overflow-y:hidden; overflow-x:auto; text-align:center; }
.chart ul { white-space:nowrap; font-size:0; }
.chart ul li { position:relative; display:inline-block; width:50px; height:240px; padding:20px 10px 0 10px; text-align:center; font-size:12px; }
.chart ul li .progress { margin:0 auto; overflow:visible; }
.chart ul li .progress .score { position:absolute; top:-20px; display:block; width:30px; margin-left:-5px; font-size:10px; color:#999; text-align:center; }
.chart ul li p { position:absolute; top:230px; width:100%; margin-left:-10px; white-space:normal; text-align:center; }


/* Vertical Bar Graph For Bootstrap */
.progress-vertical {
    width: 20px;
    height: 200px !important;
    position: relative;
}
.progress-vertical .bar {
    width: 100% !important;
    position: absolute;
    bottom: 0;
    border-bottom-left-radius: inherit;
    border-bottom-right-radius: inherit;
}